import './FollowUpsituation.scss'
import { Form, Input, Button, Select, Image, Modal,Row,Col,Space,DatePicker } from 'antd';
import { ExclamationCircleOutlined } from '@ant-design/icons';
import TextArea from 'antd/lib/input/TextArea';
import { useEffect } from 'react';
import http from '../../../utils/http';
const { confirm } = Modal;
const { Option } = Select;
const FollowUpsituation=(props)=>{
  const [form] = Form.useForm();
  const onFinish = (values) => {
    console.log(values);
  };
  useEffect(()=>{
    // console.log(props.followkey);
    http({
      url:'/customer-development/Follow_situation',
      method:'post',
      params:{
        cus_id:props.followkey
      }
    }).then((res)=>{
      console.log('跟进记录',res);
      res.data.map((v,i)=>{
        form.setFieldsValue({
          follower:v.adminName,
          way:v.communicateType==0?'电话':'线下',
          state:v.followState== 0 ? '流失' : (v.followState == 1 ? '意向' : '成交'),
          grade:v.intentionGrade==0?'低':(v.intentionGrade==1?'中':'高'),
          // time:v.nextTime,
          text:v.customerContent
        })
      })
    })
  },[])
  const backCar = () => {
    props.setFollow(false)
    console.log(form.getFieldsValue().time);
  }

  const quxiao=()=>{
    console.log('quxiao');
  }
  return (
    <div className='followup'>
      <div>
        <div className='header'>
          {/* 左边 */}
          <div className='tit'>
            <div></div>
            <div>客户跟进情况</div>
          </div>
          {/* 右边 */}
          <div>
            <span className="iconfont icon-a-16guanbi" onClick={backCar}></span>
          </div>
        </div>
        <hr/>
        <div className='content'>
          <Row>
            <Col span={10}>
              <p>客户跟进记录：</p>
              <div className='leftrecord'>
                <div className='one'>
                  <div className='onetop'>
                    <div></div>
                    <div>
                      <div></div>
                      <div>2021-11-29 11:29</div>
                    </div>
                  </div>
                  <div className='onebottom'>
                    <div>
                      <div>
                        沟通方式：<br/>
                        <span><strong>电话</strong></span>
                      </div>
                      <div>
                        意向等级：<br/>
                        <span><strong>中</strong></span>
                      </div>
                      <div>
                        跟进人：<br/>
                        <span><strong>约翰</strong></span>
                      </div>
                      <div>
                        跟进状态：<br/>
                        <span><strong>沟通</strong></span>
                      </div>
                    </div>
                    <hr/>
                    <p>跟进内容：初步表示有意向入住，价格和楼宇的选择有待商榷</p>
                    <p>计划下次跟进时间：2022/01/24</p>
                  </div>
                </div>
                <div className='one'>
                  <div className='onetop'>
                    <div></div>
                    <div>
                      <div></div>
                      <div>2021-11-29 11:29</div>
                    </div>
                  </div>
                  <div className='onebottom'>
                    <div>
                      <div>
                        沟通方式：<br/>
                        <span><strong>电话</strong></span>
                      </div>
                      <div>
                        意向等级：<br/>
                        <span><strong>中</strong></span>
                      </div>
                      <div>
                        跟进人：<br/>
                        <span><strong>约翰</strong></span>
                      </div>
                      <div>
                        跟进状态：<br/>
                        <span><strong>接触</strong></span>
                      </div>
                    </div>
                    <hr/>
                    <p>跟进内容：初步表示有意向入住，价格和楼宇的选择有待商榷</p>
                    <p>计划下次跟进时间：2022/01/24</p>
                  </div>
                </div>
              </div>
            </Col>
            <Col span={14}>
              <p>详细情况：</p>
              <Form form={form} name="control-hooks" onFinish={onFinish}>
                  <Form.Item
                      name="follower"
                      label="跟进人"
                      rules={[
                          {
                              required: true,
                          },
                      ]}
                  >
                      <Input placeholder='' />
                  </Form.Item>
                  <Form.Item
                      name="way"
                      label="沟通方式"
                      rules={[
                          {
                              required: true,
                          },
                      ]}
                  >
                      <Input placeholder='' />
                  </Form.Item>
                  <Form.Item
                      name="state"
                      label="跟进状态"
                      rules={[
                          {
                              required: true,
                          },
                      ]}
                  >
                      <Input placeholder='' />
                  </Form.Item>
                  <Form.Item
                      name="grade"
                      label="意向等级"
                      rules={[
                          {
                              required: true,
                          },
                      ]}
                  >
                      <Input placeholder='' />
                  </Form.Item>
                  <Form.Item
                      name="time"
                      label="计划下次跟进时间"
                      rules={[
                          {
                              required: true,
                          },
                      ]}
                  >
                      <DatePicker placeholder='' />
                  </Form.Item>
                  <Form.Item
                      name="text"
                      label="跟进内容"
                      rules={[
                          {
                              required: true,
                          },
                      ]}
                  >
                      <Input.TextArea cols='' rows='6' placeholder='' />
                  </Form.Item>
                </Form>
            </Col>
          </Row>
        </div>
        {/* 3、尾部：保存、取消按钮 */}
        {/* <div className='footer'>
          <Form.Item>
            <Space size='large'>
                <Button type="primary" htmlType="submit">
                    保存
                </Button>
                <Button onClick={quxiao}>
                    取消
                </Button>
            </Space>
          </Form.Item>
        </div> */}
      </div>
    </div>
  )
}
export default FollowUpsituation;